{% extends 'front/user_base.html' %}
{% from 'front/_macros.html' import pagination_widget as render_page %}
{% block css %}
    <style>
    .topic-list .topic-item{
        border-bottom: 1px solid #ccc;
        margin-bottom: 10px;
        padding-bottom: 10px;
    }
    .club.update-btn{
        border: none;
        background-color: #1d9718;
        height: 35px;
        vertical-align: middle;
        line-height: 35px;
        color: #fff;
        padding: 0 15px;
        border-radius: 4px;
    }
    </style>
{% endblock %}
{% block content %}
    <div class="tabs-warp">
        <div class="tabs">
            <ul>
                <li class="">
                    <a href="/user/center/?page=1" class="">
                        <span class="icon is-small">
                            <i aria-hidden="true" class="iconfont icon-topic"></i>
                        </span>
                        <span>俱乐部</span>
                    </a>
                </li>
                <li class="">
                    <a href="/user/post/?page=1" class="">
                        <span class="icon is-small">
                            <i aria-hidden="true" class="iconfont icon-article"></i>
                        </span>
                        <span>分享</span>
                    </a>
                </li>
                <li class="active">
                    <a href="/access/record/?page=1" class="">
                        <span class="icon is-small">
                            <i aria-hidden="true" class="iconfont icon-topic"></i>
                        </span>
                        <span>访客记录</span>
                    </a>
                </li>
            </ul>
        </div>
        <div>
            <div>
                {% for category, message in get_flashed_messages(with_categories=true) %}
                    <div class="alert alert-{{ category }} alert-dismissable pure-u-1 pure-u-md-21-24">
                        {{ message }}
                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                    </div>
                {% endfor %}
                <ul class="topic-list">
                    {% for record in club_access_list %}
                        <li class="topic-item">
                            <div class="club-box">
                                <div style="margin-top: 1rem;">
                                    {{ record.accessor.username}} 在{{ record.create_time }} 访问了 {{ record.access_club.name }}
                                </div>
                            </div>
                        </li>
                    {% endfor %}
                    {{ render_page(pagination, endpoint)}}
                </ul>
            </div>
        </div>
    </div>
{% endblock %}